<%layout("/common/layout.html"){%>

<div class="main-bg container">

    <%if(session.sessionEnv!=null){%>
    <%if(session.sessionEnv.user.id==user.id){%>
    <a href="${ctxPath}/user/myInfo" title="设置" class="btn btn-warning if-set">
        <span class="glyphicon glyphicon-pencil" style="color: black"></span> 更改信息
    </a>
    <%}}%>

    <div class="profile">
        <img src="${user.img}" class="img-circle" alt="" width="150" height="150">

        <p class="if-name">${user.name}</p>

        <div class="row text-center">
            <div class="signature">${user.feeling}</div>
        </div>

    </div>

    <main>
        <div class="container person-setup" role="tabpanel">


            <%if(((session.sessionEnv.user!=null))&&(session.sessionEnv.user.id==user.id)){%>

            <div class="if-nav row">
                <div class="col-md-10 col-md-offset-1">
                    <ul class="nav nav-pills classify" role="tablist" id="myTab">
                        <li role="presentation" class="active"><a href="#zan" role="tab" data-toggle="tab">我的收藏</a></li>
                        <li role="presentation"><a href="#designed" role="tab" data-toggle="tab">我的设计</a></li>
                        <li role="presentation"><a href="#bought" role="tab" data-toggle="tab">我购买的</a></li>
                        <li role="presentation"><a href="#resource" role="tab" data-toggle="tab">我的素材</a></li>
                    </ul>
                </div>
            </div>


            <div class="tab-content">

                <div role="tabpanel" class="tab-pane active container-fluid" id="zan">
                    <div class="fall-layout row">
                        <div class="col-md-10 col-md-offset-1 text-center">
                            <div class="col-md-3">
                                <a href="#" class="if-add-re">
                                    <div class="if-plus">
                                        <span class="if-plus glyphicon glyphicon-tag"></span>
                                    </div>
                                    <p>去逛逛~</p>
                                </a>
                            </div>
                            <%for(design0 in collects){%>

                            <div class="col-md-3">
                                <a href="${ctxPath}/design?design=${design0.design.id}" class="thumbnail">
                                    <img src="${design0.design.img1}" alt="...">
                                </a>
                            </div>

                            <%}%>


                        </div>
                    </div>
                </div>

                <div role="tabpanel" class="tab-pane container-fluid" id="designed">
                    <div class="fall-layout row">
                        <div class="col-md-10 col-md-offset-1 text-center">
                            <div class="col-md-3">
                                <a href="#" class="if-add-re">
                                    <div class="if-plus">
                                        <span class="if-plus glyphicon glyphicon-pencil"></span>
                                    </div>
                                    <p>我要设计~</p>
                                </a>
                            </div>

                            <%for(design1 in designs){%>

                            <div class="col-md-3">
                                <a href="${ctxPath}/design?design=${design1.id}" class="thumbnail">
                                    <img src="${design1.img1}" alt="...">
                                </a>
                            </div>

                            <%}%>

                        </div>
                    </div>
                </div>
                <div role="tabpanel" class="tab-pane container-fluid" id="bought">
                    <div class="fall-layout row">
                        <div class="col-md-10 col-md-offset-1 text-center">

                            <%for(order in orders){%>

                            <div class="col-md-3">
                                <a href="${ctxPath}/design/info?design=${order.design.id}" class="thumbnail">
                                    <img src="${order.design.img1}" alt="...">
                                </a>
                            </div>

                            <%}%>

                        </div>
                    </div>
                </div>
                <div role="tabpanel" class="tab-pane container-fluid" id="resource">
                    <div class="fall-layout row">
                        <div class="col-md-10 col-md-offset-1 text-center">
                            <div class="col-md-3">
                                <a href="${ctxPath}/addImg" class="if-add-re">
                                    <div class="if-plus">
                                        <span class="if-plus glyphicon glyphicon-plus"></span>
                                    </div>
                                    <p>添加素材</p>
                                </a>
                            </div>

                            <%for(image in images){%>
                            <div class="col-md-3">
                                <a href="#" class="thumbnail">
                                    <img src="${image.img}" alt="...">
                                </a>
                            </div>
                            <%}%>

                        </div>
                    </div>
                </div>
            </div>
            <%}else{%>

            <div class="col-md-10 col-md-offset-1 text-center">

                <%for(design1 in designs){%>

                <div class="col-md-3">
                    <a href="${ctxPath}/design?design=${design1.id}" class="thumbnail">
                        <img src="${design1.img1}" alt="...">
                    </a>
                </div>

                <%}%>

            </div>

            <%}%>

        </div>
    </main>

    <%include("/common/footer.html"){}%>

    <script type="text/javascript" src="${ctxPath}/js/jquery-2.1.3.min.js"></script>
    <script type="text/javascript" src="${ctxPath}/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="${ctxPath}/js/nav.js"></script>
    <script type="text/javascript" src="${ctxPath}/js/tog.js"></script>

    <script type="text/javascript">
        $('#myTab a').click(function (e) {
            e.preventDefault();
            $(this).tab('show');
        })
    </script>

    <%}%>